<script setup>
import {ref} from 'vue'
const list = [
  {
    "pagePath": "/pages/user/user/index",
    "iconPath": "/static/img1_noselect.png",
    "selectedIconPath": "/static/img1_select.png",
    "text": "首页"
  },
  {
    "pagePath": "/pages/user/user/user",
    "iconPath": "/static/img2_noselect.png",
    "selectedIconPath": "/static/img2_select.png",
    "text": "个人信息"
  }
]
const cururl=ref(list[0].pagePath);
const totabbar=(path)=>{
  cururl.value=path
  uni.navigateTo({
    url:path
  })
}
const props=defineProps({
  curindex:{
    type:Number,
    default:0
  }
})
</script>

<template>
  <view class="main">
    <view class="h1" v-for="(item,index) in list" :key="index" @click="totabbar(item.pagePath)">
      <view>
        <image v-if="index!= props.curindex" class="img" :src="item.iconPath"></image>
        <image v-else class="img" :src="item.selectedIconPath"></image>
      </view>
      <view>
      {{ item.text }}
      </view>
    </view>
  </view>
</template>

<style scoped lang="scss">
.main{
  height: 50px;
  width: 100%;
  background-color:#ffffff;
  display: flex;
  justify-content: space-around;
  position: fixed;
  bottom: 0;
  font-size: 10px;
  color: black;
}
.img{
  width: 28px;
  height: 28px;

}
.h1{
  text-align: center;
}
</style>